<template>
  <div class="leftBox">
        <el-menu
          default-active="2"
          class="el-menu-vertical-demo mynav"
          background-color="#0d2439"
          text-color="#fff"
          active-text-color="#65a8f2"
          :router="true"
        >
            <el-submenu index="1">
              <template slot="title">
                <i class="iconfont icon-panel"></i>
                <span>首页</span>
              </template>
              <el-menu-item index="/home/dashboard">仪表盘</el-menu-item>
              <el-menu-item index="/home/data">设备数据</el-menu-item>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title">
                <i class="iconfont icon-luyouqi"></i>
                <span>设备</span>
              </template>
              <el-menu-item index="/device/gateway">网关</el-menu-item>
              <el-menu-item index="/device/grouplist">设备群组</el-menu-item>
              <el-menu-item index="/device/sensorlist">传感器列表</el-menu-item>
            </el-submenu>
            <el-submenu index="3">
              <template slot="title">
                <i class="iconfont icon-fyxx"></i>
                <span>计费</span>
              </template>
              <el-menu-item index="/charging/BilAccount">账户信息</el-menu-item>
              <el-menu-item index="/charging/Recharge">充值记录</el-menu-item>
              <el-menu-item index="/charging/useList">使用记录</el-menu-item>
            </el-submenu>
            <el-submenu index="4">
              <template slot="title">
                <i class="iconfont icon-signal"></i>
                <span>测量类型</span>
              </template>
              <el-menu-item index="/measure/addmeasure">添加测量类型</el-menu-item>
              <el-menu-item index="/measure/measureType">测量类型列表</el-menu-item>
            </el-submenu>
            <el-submenu index="5">
              <template slot="title">
                <i class="iconfont icon-anquan"></i>
                <span>安全</span>
              </template>
              <el-menu-item index="/security/addsecretKey">添加密钥</el-menu-item>
              <el-menu-item index="/security/secretKeyList">密钥列表</el-menu-item>
            </el-submenu>
            <el-submenu index="6">
              <template slot="title">
                <i class="iconfont icon-account"></i>
                <span>账号</span>
              </template>
              <el-menu-item index="/account/addaccount">添加账号</el-menu-item>
              <el-menu-item index="/account/accountList">账号列表</el-menu-item>
            </el-submenu>  
            <el-submenu index="7">
              <template slot="title">
                <i class="iconfont icon-d-right-arrow"></i>
                <span>server</span>
              </template>
              <el-menu-item index="/home/dashboard">仪表盘</el-menu-item>
              <el-menu-item index="1-2">设备数据</el-menu-item>
          </el-submenu>
          <el-submenu index="8">
              <template slot="title">
                <i class="iconfont icon-d-right-arrow"></i>
                <span>demo</span>
              </template>
              <el-menu-item index="/home/dashboard">仪表盘</el-menu-item>
              <el-menu-item index="1-2">设备数据</el-menu-item>
          </el-submenu>
        </el-menu>
        <div class="menu">
          <i class="iconfont icon-foldLeft"></i>
        </div>
      </div>
</template>

<script>
export default {
    name:"Sidebar"
}
</script>

<style scoped lang="scss">
.iconfont{
  font-size: 18px;
  padding-right:5px;
}
.leftBox {
  width: 167px;
  background: #0d2439;
  color: #fff;
  overflow: hidden;
  position: relative;
}
.mynav {
  width: 167px;
  font-size: 13px !important;
  height:30px;
}
.el-submenu .el-menu-item{
  font-size: 12px !important;
}
.el-submenu__title{
  height:30px !important;
  opacity: 0;
}
.el-submenu__title span{
  font-size: 12px !important;
}
.menu{
  width:20px;
  height:20px;
  position: absolute;
  left:25px;
  bottom: 30px;
  cursor: pointer;
}
</style>